<template>
  <div id="footer">
    <div class="container">
      <ul class="business">
        <li class="item">
          关于我们
        </li>
        <li class="item">
          用户隐私政策
        </li>
        <li class="item">
          用户服务协议
        </li>
        <li class="item" style="border-right: 0px solid #eaecf0 !important;">
          联系我们
        </li>
      </ul>
      <div class="communication">
        <el-popover
            placement="top-start"
            trigger="hover">
          <template #reference>
            <el-icon style="margin-right: 40px">
              <ChatDotRound/>
            </el-icon>
          </template>
          <template #default>
            <div>
              描述微信
            </div>
          </template>
        </el-popover>
        <el-popover
            placement="top-start"
            trigger="hover">
          <template #reference>
            <el-icon>
              <Service/>
            </el-icon>
          </template>
          <template #default>
            <div>
              描述电话
            </div>
          </template>
        </el-popover>
      </div>
      <div class="webInfo">
        <p data-v-168a7137="" class="info">Copyright © 2010-2022 南京爱一格网络科技有限公司 版权所有</p>
        <p data-v-168a7137="" class="info">
          经营性许可证编号：<a href="https://beian.miit.gov.cn/" target="_blank" rel="noopener" class="info">苏B2-20180515</a>&nbsp;&nbsp;
          <a href="http://ccm.mct.gov.cn/ccnt/sczr/service/business/emark/toDetail/b324ae6cb184469691bb4a8e75a93b41"
             target="_blank" rel="noopener" class="info">
            <img src="https://rs.dance365.com/jinying.png"
                 style="width: 20px; height: 20px; position: relative; top: 5px;"/>苏网文〔2021〕4647-106号</a>
        </p>
        <a href="https://beian.miit.gov.cn/" target="_blank" rel="noopener" class="info">苏ICP备20036081号</a>
        <p class="info">
          <a target="_blank" href="http://www.beian.gov.cn/portal/registerSystemInfo?recordcode=32010602010735">
            <img src="https://rs.dance365.com/pc/gongan.png">苏公网安备 32010602010735号
          </a>
        </p>
      </div>
    </div>

  </div>
</template>

<script setup lang="ts">

</script>

<style scoped lang="less">
#footer {
  text-align: center;
  background-color: #221f23;
  color: #b1b5c1;
  font-size: 14px;
  .container {
    width: 1200px;
    padding: 24px 40px 0;
    margin: 0 auto;

    .business {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-padding-start: 0;
      list-style: none;
      -ms-flex-pack: distribute;
      justify-content: space-around;

      .item {
        border-right: 1px solid #eaecf0;
        width: calc(25% - 4px);
        list-style: none;

        &:hover {
          color: #f93684;

        }
      }


    }

    .communication {
      margin: 28px auto 30px;

      .el-icon {
        cursor: pointer;
        font-size: 28px;
      }

      &:hover {
        color: #f93684;
      }
    }

    .webInfo {
      margin-bottom: 32px ;
      .info {
        margin: 14px 0;
      }
    }
  }
}


</style>
